<script lang="ts" setup>
import SuperTable from "@/module/table/superTable.vue";
import {Story} from "@/dto/Main/Story.ts";
import {Message, MessageBox} from "@/module/message/Message.ts";
import SuperButton from "@/module/button/superButton.vue";
import {useStoryStore} from "@/store/admin/Main/StoryStore.ts";
import router from "@/config/router.ts";
import ImageView from "@/module/image/ImageView.vue";

const store = useStoryStore()

async function add() {
    store.setStory(new Story())
    await router.push({path: "/admin/story/story-context"})
}

async function edit(row: Story) {
    store.setStory(row)
    await router.push({path: "/admin/story/story-context"})
}

async function deleted(row: Story) {
    MessageBox.confirm_deleted(async ()=>{
        await store.getApi().deleted(row)
        await store.initTableData()
        Message.success("删除成功")
    })
}
</script>

<template>
    <super-table
            :data="store.getTableData()"
            :column-list="Story.getColumn()"
            @init="store.initTableData()"
            :page="store.getPageConfig()">
        <template #column="{row,column}">
            <template v-if="column.prop === 'img'">
                <image-view v-model="row[column.prop]" height="200" width="200"/>
            </template>
        </template>
        <template #header-button>
            <super-button title="新增故事" type="success" @click="add"/>
        </template>
        <template #controls="{row}">
            <super-button title="编辑" type="success" @click="edit(row)"/>
            <super-button title="删除" type="danger" @click="deleted(row)"/>
        </template>
    </super-table>
</template>

<style scoped>

</style>